<template>
  <div class="home">
    <div class="welcome">
      <p class="welcome-text">Welcome administrator</p>
      <img src="@/assets/welcome.png" class="welcome-img" />
    </div>
  </div>
</template>

<script>
export default {
  name: "home",
};
</script>

<style scoped>
@font-face {
  font-family: magicFont;
  src: url("../../assets/fonts/MagicOwl.otf");
}

.home {
  position: relative;
  height: 100%;
}

.welcome {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -60%);
  text-align: center;
}

.welcome-text {
  font-family: magicFont;
  font-size: 50px;
  margin: 0;
}

.welcome-img {
  width: 500px;
}
</style>
